I have a class like that
class Message {
initTextForm() {
document.addEventListener('input', function(e) {
this.addTextMessage(e.target.innerHTML);
});
}
addTextMessage(text) {
console.log(text);
}
}
new Message().initTextForm()
<input/>
How to transfer class "this" into event listener?
Use an arrow function:
class Message {
initTextForm() {
document.addEventListener('input', (e) => {
this.addTextMessage(e.target.value);
});
}
addTextMessage(text) {
console.log(text);
}
}
new Message().initTextForm()
<input/>
You can use two ways:
class Message {
initTextForm() {
document.addEventListener('input', (e) => {
this.addTextMessage(e.target.value);
});
}
addTextMessage(text) {
console.log(text);
}
}
new Message().initTextForm()
<input/>
class Message {
constructor(){
this.addTextMessage = this.addTextMessage.bind(this);
}
initTextForm() {
document.addEventListener('input', this.addTextMessage)
}
addTextMessage(e) {
console.log(e.target.value);
}
}
new Message().initTextForm()
<input/>